<style>
    /*.tabs {*/
        /*width: 100% !important;*/
    /*}*/
    .menu-icon {
        position: inherit !important;
    }
    .easyui-tabs .panel-body{
        background-color: #f5f5f5;
    }
    #ul_secret_key li a .chat-detail .chat-message{
        width: auto;
    }
    .top-nav .nav-notification > li > a:hover, .top-nav .nav-notification > li > a:focus{
        background-color: inherit;
    }
    .sidebar-right .content-block .sidebar-list li a{
        padding: 1px 10px;
    }
    .main-menu > .accordion li >a{
        cursor:pointer;
    }
    .main-menu span{
        font-size: 13px;
    }
    .sidebar-menu.sidebar-mini .main-menu li a .menu-content-hover{
        padding: 25px 3px;
    }
    /*.tabs-panels > .panel{*/
        /*border-width: 0;*/
    /*}*/
    /*.tabs li.tabs-selected a.tabs-inner {*/
        /*background-color: #f5f5f5;*/
    /*}*/
    /*.tabs li.tabs-selected a.tabs-inner {*/
        /*border-bottom: 1px solid #f5f5f5;*/
    /*}*/


    .top-nav .nav-header .brand,.top-nav{
        background-color: #1c2b36;
        color: #ffffff;
    }

    .top-nav .user-block .user-detail{
        color: #e8e1e1;
    }

    @media (min-width: 992px) {
        .top-nav .nav-header,
        .sidebar-menu{
            width:200px;
        }
        .main-container{
            margin-left: 200px;
        }
    }

    .tab-content {
        height: 100%;
    }
    .tab-content > .tab-pane {
        height: 100%;
    }
    .nav-tabs {
        height: 42px;
    }
    #xh_top_tabs .roll-nav .dropdown-menu {
        margin:2px 0 0 -135px;
    }
    #xh_top_tabs .tab-list-container {
        max-height:250px;
        overflow-y: auto;
    }


    /*消息*/
    .xh-msg-notice-list .m-left-xs {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: inline-block;
        width: 90%;
        position: absolute;
        top: 12px;
        font-weight: bold;
    }
    .xh-msg-notice-list .is-read {
        font-weight: inherit !important;
        color: #888888;
    }
    .xh-msg-notice-list .text-muted {
        top: 26px !important;
    }
    .xh-msg-task-list .detail p {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: bold;
    }
</style>
{#<div class="modal fade lock-screen-wrapper xh-hidden" id="lockScreen">#}
    {#<div class="modal-dialog">#}
        {#<div class="modal-content">#}
            {#<div class="modal-body">#}
                {#<div class="lock-screen-img">#}
                    {#<i class="fa fa-lock fa-5x" style="color: #fff;"></i>#}
                {#</div>#}

                {#<div class="text-center m-top-sm">#}
                    {#<div class="h4 text-white" style="margin-bottom: 15px">锁定：{{ UserName }}</div>#}

                    {#<div class="input-group m-top-sm">#}
                        {#<input type="password" class="form-control text-sm" placeholder="输入密码..." id="lock_password">#}
                        {#<span class="input-group-btn">#}
                            {#<a id="bt_UnLock" class="btn btn-success">#}
                                {#<i class="fa fa-arrow-right"></i>#}
                            {#</a>#}
                        {#</span>#}
                    {#</div>#}
                {#</div>#}
            {#</div>#}
        {#</div>#}
    {#</div>#}
{#</div>#}

<div class="wrapper preload" style="height: 100%">
    <!--顶部菜单-->
    <header class="top-nav">
        <div class="top-nav-inner">
            <div class="nav-header">
                <!--小屏下按钮-->
                <button type="button" class="navbar-toggle pull-left sidebar-toggle" id="sidebarToggleSM">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <!--小屏下设置内容-->
                {#<ul class="nav-notification pull-right">#}
                    {#<li>#}
                        {#<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-cog fa-lg"></i></a>#}
                        {#<span class="badge badge-danger bounceIn">1</span>#}
                        {#<ul class="dropdown-menu dropdown-sm pull-right user-dropdown">#}
                            {#<li class="user-avatar">#}
                                {#<div class="user-content">#}
                                    {#<h5 class="no-m-bottom">Jane Doe</h5>#}
                                    {#<div class="m-top-xs">#}
                                        {#<a href="profile.html" class="m-right-sm">Profile</a>#}
                                        {#<a href="signin.html">Log out</a>#}
                                    {#</div>#}
                                {#</div>#}
                            {#</li>#}
                            {#<li>#}
                                {#<a href="inbox.html">#}
                                    {#Inbox#}
                                    {#<span class="badge badge-danger bounceIn animation-delay2 pull-right">1</span>#}
                                {#</a>#}
                            {#</li>#}
                            {#<li>#}
                                {#<a href="#">#}
                                    {#Notification#}
                                    {#<span class="badge badge-purple bounceIn animation-delay3 pull-right">2</span>#}
                                {#</a>#}
                            {#</li>#}
                            {#<li>#}
                                {#<a href="#" class="sidebarRight-toggle">#}
                                    {#Message#}
                                    {#<span class="badge badge-success bounceIn animation-delay4 pull-right">7</span>#}
                                {#</a>#}
                            {#</li>#}
                            {#<li class="divider"></li>#}
                            {#<li>#}
                                {#<a href="#">Setting</a>#}
                            {#</li>#}
                        {#</ul>#}
                    {#</li>#}
                {#</ul>#}

                <a href="./" class="brand" style="text-align: left;">
                    <img src="{{ url('frontend/img/logo.png') }}" style="width: 68px;" alt="学海">
                    <span class="brand-name" style="font-weight: 400;color: #fff">教育即服务</span>
                </a>
            </div>
            <div class="nav-container">
                <!--大屏下按钮-->
                <button type="button" class="navbar-toggle pull-left sidebar-toggle" id="sidebarToggleLG" style="display: none">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <!--大屏下搜索框-->
                {#<ul class="nav-notification">#}
                    {#<li class="search-list">#}
                        {#<div class="search-input-wrapper">#}
                            {#<div class="search-input">#}
                                {#<input type="text" class="form-control input-sm inline-block">#}
                                {#<a href="#" class="input-icon text-normal"><i class="ion-ios7-search-strong"></i></a>#}
                            {#</div>#}
                        {#</div>#}
                    {#</li>#}
                {#</ul>#}
                <div class="pull-right m-right-sm">
                    <div class="user-block hidden-xs" style="padding-right: 20px">
                        {#<div class="checkbox inline-block" style="margin:0 20px 0 0;font-weight: 400;">#}
                            {#<div class="custom-checkbox" style="top:6px">#}
                                {#<input type="checkbox" id="tab_view_change" checked>#}
                                {#<label for="tab_view_change"></label>#}
                            {#</div>#}
                            {#<label for="tab_view_change" style="padding-left: 0;">页签方式浏览</label>#}
                        {#</div>#}
                        <a href="#" id="userToggle" data-toggle="dropdown">
                            <img src="{{ url('frontend/img/head.png') }}" alt="头像" class="img-circle inline-block user-profile-pic">
                            <div class="user-detail inline-block">
                                {{ UserName }}
                                <i class="fa fa-angle-down"></i>
                            </div>
                        </a>
                        <div class="panel border dropdown-menu user-panel" style="margin-left: -30px">
                            <div class="panel-body paddingTB-sm">
                                <ul>
                                    <li>
                                        <a style="cursor:pointer;" id="bt_ChangePwd">
                                            <i class="fa fa-edit fa-lg"></i><span class="m-left-xs">修改密码</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a style="cursor:pointer;" id="bt_homeSet">
                                            <i class="fa fa-cog fa-lg"></i><span class="m-left-xs">首页设置</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a style="cursor:pointer;" id="bt_mine">
                                            <i class="fa fa-user fa-lg"></i><span class="m-left-xs">个人中心</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="{{ url('Index/SignOut') }}">
                                            <i class="fa fa-power-off fa-lg"></i><span class="m-left-xs">退出</span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <ul class="nav-notification">

                        <li class="" id="xh_msg_notice">
                            <a href="#" data-toggle="dropdown"><i class="fa fa-bell fa-lg"></i></a>
                            <span class="badge badge-info animation-delay6 active xh-msg-noticeNum">0</span>
                            <ul class="dropdown-menu notification dropdown-3 pull-right">
                                <li><a>您有<font class="xh-msg-noticeNum">0</font>条未读消息</a></li>
                                <li><a href="#" id="xh_msg_notice_view">查看所有消息</a></li>
                            </ul>
                        </li>

                        <li class="" id="xh_msg_task">
                            <a href="#" data-toggle="dropdown"><i class="fa fa-tasks fa-lg"></i></a>
                            <span class="badge badge-purple animation-delay5 active xh-msg-taskNum">0</span>
                            <ul class="dropdown-menu message pull-right">
                                <li><a>您有<font class="xh-msg-taskNum">0</font>条待处理任务</a></li>
                                <li><a href="#" id="xh_msg_task_view">查看所有任务</a></li>
                            </ul>
                        </li>

                        <li class="chat-notification">
                            <a href="#" class="sidebarRight-toggle"><i class="fa fa-list-ul fa-lg"></i></a>
                            {#<span class="badge badge-danger bounceIn active">1</span>#}
                            {#<div class="chat-alert">#}
                                {#展开更多#}
                            {#</div>#}
                        </li>
                    </ul>
                </div>
            </div>
        </div><!-- ./top-nav-inner -->
    </header>
    <!--左侧菜单-->
    <aside class="sidebar-menu fixed">
        <div class="sidebar-inner scrollable-sidebar">
            <div class="main-menu">
                <ul class="accordion">
                    {#<li class="menu-header">#}
                        {#Main Menu#}
                    {#</li>#}
                    {#<li class="bg-palette2">#}
                        {#<a>#}
                            {#<span class="menu-content block">#}
                                {#<span class="menu-icon"><i class="block fa fa-home fa-lg"></i></span>#}
                                {#<span class="text m-left-sm">主页</span>#}
                            {#</span>#}
                            {#<span class="menu-content-hover block">#}
                                {#Home#}
                            {#</span>#}
                        {#</a>#}
                    {#</li>#}
                    {% if isAdmin %}
                        <li class="openable bg-palette1">
                            <a>
                            <span class="menu-content block">
                                <span class="menu-icon"><i class="fa fa-cog fa-lg"></i></span>
                                <span class="text m-left-sm">测试页面</span>
                                <span class="submenu-icon"></span>
                            </span>
                            <span class="menu-content-hover block">
                                导航
                            </span>
                            </a>
                            <ul class="submenu">
                                <li class="">
                                    <a href="{{ url('App/appStoreList') }}" target="iframe">
                                        <span class="submenu-label">应用列表-老</span>
                                    </a>
                                </li>
                                <li class="">
                                    <a href="{{ url('Flowtmp/template') }}" target="iframe">
                                        <span class="submenu-label">流程测试</span>
                                    </a>
                                </li>
                            </ul>

                        </li>
                        <li class="openable bg-palette2">
                            <a>
                            <span class="menu-content block">
                                <span class="menu-icon"><i class="fa fa-cog fa-lg"></i></span>
                                <span class="text m-left-sm">系统设置</span>
                                <span class="submenu-icon"></span>
                            </span>
                            <span class="menu-content-hover block">
                                导航
                            </span>
                            </a>
                            <ul class="submenu">
                                <li class="openable">
                                    <a>
                                        <span class="submenu-label">导航管理</span>
                                    </a>
                                    <ul class="submenu third-level">
                                        <li><a href="{{ url('Sys/navAdd') }}" target="iframe"><span class="submenu-label">添加导航</span></a></li>
                                        <li><a href="{{ url('Sys/navEdit') }}" target="iframe"><span class="submenu-label">修改导航</span></a></li>
                                    </ul>
                                </li>
                                <li>
                                    <a href="{{ url('Sys/powerAdd') }}" target="iframe">
                                        <span class="submenu-label">权限管理</span>
                                    </a>
                                    {#<ul class="submenu third-level">#}
                                        {#<li><a href="{{ url('Sys/powerAdd') }}" target="iframe"><span class="submenu-label">添加权限</span></a></li>#}
                                        {#<li><a href="{{ url('Sys/powerList') }}" target="iframe"><span class="submenu-label">权限列表</span></a></li>#}
                                    {#</ul>#}
                                </li>
                                <li class="openable">
                                    <a>
                                        <span class="submenu-label">枚举管理</span>
                                    </a>
                                    <ul class="submenu third-level">
                                        <li><a href="{{ url('Sys/enumAdd') }}" target="iframe"><span class="submenu-label">添加枚举</span></a></li>
                                        <li><a href="{{ url('Sys/enumList') }}" target="iframe"><span class="submenu-label">枚举列表</span></a></li>
                                    </ul>
                                </li>
                                {#<li>#}
                                    {#<a href="{{ url('Sys/synCode') }}" target="iframe"><span class="submenu-label">同步代码</span></a>#}
                                {#</li>#}
                            </ul>
                        </li>
                    {% endif %}

                    {{ nav }}
                </ul>
            </div>
            {#<div class="sidebar-fix-bottom clearfix">#}
                {#<div class="user-dropdown dropup pull-left">#}
                    {#<a href="#" class="dropdwon-toggle font-18" data-toggle="dropdown"><i class="fa fa-user-plus"></i>#}
                    {#</a>#}
                    {#<ul class="dropdown-menu">#}
                        {#<li>#}
                            {#<a href="inbox.html">#}
                                {#Inbox#}
                                {#<span class="badge badge-danger bounceIn animation-delay2 pull-right">1</span>#}
                            {#</a>#}
                        {#</li>#}
                        {#<li>#}
                            {#<a href="#">#}
                                {#Notification#}
                                {#<span class="badge badge-purple bounceIn animation-delay3 pull-right">2</span>#}
                            {#</a>#}
                        {#</li>#}
                        {#<li>#}
                            {#<a href="#" class="sidebarRight-toggle">#}
                                {#Message#}
                                {#<span class="badge badge-success bounceIn animation-delay4 pull-right">7</span>#}
                            {#</a>#}
                        {#</li>#}
                        {#<li class="divider"></li>#}
                        {#<li>#}
                            {#<a href="#">Setting</a>#}
                        {#</li>#}
                    {#</ul>#}
                {#</div>#}
                {#<a id="bt_Lock" href="{{ url('Index/SignOut') }}" class="pull-right font-18" style="cursor: pointer; float:right;"><i class="fa fa-sign-out"></i></a>#}
            {#</div>#}
        </div>
    </aside>

    <!--右侧菜单-->
    <div class="sidebar-right">
        <div class="sidebar-inner scrollable-sidebar">
            <div class="sidebar-header clearfix">
                <input class="form-control dark-input" placeholder="Search" type="text">
                <div class="btn-group pull-right">
                    <a href="#" class="sidebar-setting" data-toggle="dropdown"><i class="fa fa-cog fa-lg"></i></a>
                    <ul class="dropdown-menu pull-right flipInV">
                        <li><a href="#"><i class="fa fa-circle text-danger"></i><span class="m-left-xs">建设中...</span></a></li>
                        <li><a href="#"><i class="fa fa-circle-o"></i><span class="m-left-xs">建设中...</span></a></li>
                    </ul>
                </div>
            </div>
            {#<div class="title-block">#}
                {#浏览模式#}
            {#</div>#}
            {#<div class="content-block">#}
                {#<ul class="sidebar-list">#}
                    {#<li>#}
                        {#<a href="#" id="bt_view_change">#}
                            {#<i class="fa fa-circle-o text-success"></i><span class="m-left-xs">页签模式</span>#}
                        {#</a>#}
                    {#</li>#}
                {#</ul>#}
            {#</div>#}
            {% if isStaff %}
                {% if power['secretKey'] %}
                    <div class="title-block">
                        开发者密钥
                    </div>
                    <div class="content-block">
                        <ul class="sidebar-list" id="ul_secret_key">
                            <li>
                                <a href="#" id="bt_refresh_secret">
                                    <i class="fa fa-refresh text-success"></i><span class="m-left-xs">刷新</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                {% endif %}
                <div class="title-block">
                    其他功能
                </div>
                <div class="content-block">
                    <ul class="sidebar-list">
                        {% if power['appDown'] %}
                            <li>
                                <a href="#" id="bt_app_down">
                                    <i class="fa fa-download text-success"></i><span class="m-left-xs">应用下载</span>
                                </a>
                            </li>
                        {% endif %}
                    </ul>
                </div>
                <div class="title-block">
                    图例
                </div>
                <div class="content-block">
                    <ul class="sidebar-list">
                        {% set progress = [
                                '未开始': 'grey',
                                '进行中': 'lightskyblue',
                                '逾期进行中': 'darkred',
                                '临近一天': 'yellow',
                                '正常完成': 'blue',
                                '提前完成': 'green',
                                '超期完成': 'red'
                            ] %}
                        {% for name,color in progress %}
                        <li style="clear:left;">
                            <a href="#">
                                <div class="progress" style="margin:4px 0;width: 140px;float: left;">
                                    <div class="progress-bar" style="width: 100%;background-color: {{ color }};"></div>
                                </div>
                                <i style="color: #fff;margin-left: 10px;">{{ name }}</i>
                            </a>
                        </li>
                        {% endfor %}
                    </ul>
                </div>
            {% endif %}
        </div>
    </div>


    <div class="main-container">
        <div class="padding-md" style="padding: 0;">
            <div id="xh_top_tabs" class="nth-tabs" style="width:100%; height:calc(100% - 42px)"></div>
            {#<div id="xh_top_tabs" class="easyui-tabs" fit="true" style="width:100%;height:100%;">#}
                {#<iframe id="iframe" name="iframe" src="{{ url('Index/welcome') }}" frameborder="0" style="width: 100%;height: 100%;"></iframe>#}
                {#<iframe name="iframe" src="" frameborder="0" style="width: 100%;height: 100%;"></iframe>#}
            {#</div>#}
        </div>
    </div>
    {#<div id="xh_tab_menu" class="easyui-menu" style="width:160px;">#}
        {#<div id="xh_tab_menu-tabrefresh" data-options="name:6">刷新</div>#}
        {#<div id="xh_tab_menu-tabclose" data-options="name:1">关闭</div>#}
        {#<div id="xh_tab_menu-tabcloseall" data-options="name:2">全部关闭</div>#}
        {#<div id="xh_tab_menu-tabcloseother" data-options="name:3">关闭其他</div>#}
        {#<div class="menu-sep"></div>#}
        {#<div id="xh_tab_menu-tabcloseright" data-options="name:4">关闭右侧页面</div>#}
        {#<div id="xh_tab_menu-tabcloseleft" data-options="name:5">关闭左侧页面</div>#}
    {#</div>#}

</div>
